<template>
	<view :style="'width:'+styleObj['width']+';height:'+styleObj['height']+';'">
		<swiper :style="'width:'+styleObj['width']+';height:'+styleObj['height']+';'" autoplay="true"
			indicator-dots="true" indicator-color="#999" indicator-active-color="#fff">
			<swiper-item :style="'width:'+styleObj['width']+';height:'+styleObj['height']+';'" :item-id="item.id"
				v-for="(item,index) in list" :key="item.id">
				<image :style="'width:'+styleObj['width']+';height:'+styleObj['height']+';'" :src="item.imgUrl"  v-if="item.linkUrl"
				@click="navigate(''+item.linkUrl+'')"
				></image>
				<image :style="'width:'+styleObj['width']+';height:'+styleObj['height']+';'" :src="item.imgUrl"  v-else ></image>
			</swiper-item>
		</swiper>
	</view>
</template>

<script>
	export default {
		name: 'SwiperMap',
		props: {
			styleObj: {
				type: Object,
				default () {
					return {
						width: '100%',
						height: '100%'
					}
				}
			},
			list: Array
		},
		data() {
			return {

			}
		},
		methods:{
			navigate(url) {
				uni.navigateTo({
					url
				})
			},
		}
	}
</script>

<style lang="scss">

</style>
